<!doctype html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>鼠标悬停div边框动画</title>
</head>
<style type="text/css">
    .num{width: 200px;height: 230px;border: 2px solid #ccc;margin:50px 125px;float: left;position: relative;line-height: 230px;text-align: center;}

</style>
<body>


<div class="num num1">num1</div>

<div class="num num2">num2</div>

<div class="num num3">num3</div>

<div class="num num4">num4</div>

<div class="num num5">num5</div>

<div class="num num6">num6</div>

<div class="num num7">num7</div>



<script src="js/jquery.min.js"></script>
<script src="js/divhover.js"></script>
<script type="text/javascript">
    $(".num1").num1();
    $(".num2").num2();
    $(".num3").num3();
    $(".num4").num4();
    $(".num5").num5();
    $(".num6").num6();
    $(".num7").num7();
</script>
</body>
</html>
